﻿var timeOut = 5000;
var agingInterval = 1000 * 60 * 10;
var carMarker;
var intervalID;
var carID;

$(document).ready(function () {
    $('#carDefault').hide();
    
    var latlngCenter = new google.maps.LatLng(55, 28);
    var mapOptions = {
        zoom: 12,
        center: latlngCenter,
        streetViewControl: false,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

   

    var gMap = new DrawingArea({
        map: map,
        editorStyle: {
            enableBorder: true,
            enableDotted: true,
            enableMarkers: true
        }

    });
    carMarker = new gMap.Marker(map);
    $('[name=radio-choice]').click(function () {
        carID = this.value;
        // создание объекта для работы с картой
        
        update(carID);
        
        clearInterval(intervalID);
        intervalID = setInterval(function () {
            update(carID);
        }, timeOut);
        
    });

    function update(carID) {
        $.ajax({
            url: '/data/DetailsCar/',
            data: { id: carID },
            cache: false,
            type: 'GET',
            contentType: 'application/json; charset=utf-8',
            success: function (data) {
                $('#carDefault').show();
                $('#CarName').html(data.CarName);
                if (data.ConnectionState)
                    $('#ConnectionState').html('Связь есть');
                else {
                    $('#ConnectionState').html('Связи нету');
                }
                $('#ErrorCount').html(data.ErrorCount);
                for (var index in data.ListMessage) {
                    $('#Message_' + index.toString()).html(data.ListMessage[index]);
                }
                for (var index in data.ListCompareMesure) {
                    $('#CompareMesure_' + index.toString()).html(data.ListCompareMesure[index].InProsess.toString() + '/' + data.ListCompareMesure[index].OutProsess.toString());
                }
                var listMesure = "";
                for (var index in data.ListMesure) {
                    var mesure = data.ListMesure[index];
                    listMesure = listMesure + '<div style="text-align: center; padding: 5px">' +
                        '<span style="width: 120px"><b>' + mesure.NameMesure.toString() + '</b></span> - ' +
                        '<span>' + mesure.Value.toString() + '</span>' + '</div>';
                }
                $('#ListMesure').html(listMesure);
                
                latlngCenter = new google.maps.LatLng(data.CarCoord.X, data.CarCoord.Y);
                $('#gauge').jqxLinearGauge('value', data.FuelLevel);
                carMarker.placeCenterMarker(new gMap.LatLng(data.CarCoord.X, data.CarCoord.Y));
                setIconUpdatedObsolete(data.CarCoord.Date);
 
                
            }
        });  
    }

    var majorTicks = { size: '10%', interval: 10 },
        minorTicks = { size: '5%', interval: 2.5, style: { 'stroke-width': 1, stroke: '#aaaaaa' } },
        labels = { interval: 20 };
    
    $('#gauge').jqxLinearGauge({
        orientation: 'horizontal',
        labels: labels,
        height: 120,
        width: '20%',
        ticksMajor: majorTicks,
        ticksMinor: minorTicks,
        max: 100,
        min: 0,
        pointer: { size: '6%' },
        colorScheme: 'scheme05',
        ranges: [
            { startValue: 0, endValue: 10, style: { fill: '#FF4800', stroke: '#FF4800' } },
            { startValue: 10, endValue: 85, style: { fill: '#FFA200', stroke: '#FFA200' } },
            { startValue: 85, endValue: 100, style: { fill: '#228B22', stroke: '#228B22' } }]
    });
    
    function setIconUpdatedObsolete(date) {
        if (carMarker) {
            if ((new Date() - new Date(date)) > agingInterval) {
                carMarker.setIcon(
                    {
                        icon: "/Images/CarLogo/karer_old.png"
                    });
            } else {
                carMarker.setIcon(
                    {
                        icon: "/Images/CarLogo/karer.png"
                    });
            }
        }
    };

});
